<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>我的用车记录</title>
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/styles.css">
</head>
<body style="background: transparent;">
    <div class="records-container">
        <div class="records-header">
            <h2>我的用车记录</h2>
            <div class="filter-bar">
                <select class="form-control" style="width: 150px; margin-right: 10px;">
                    <option>全部状态</option>
                    <option>使用中</option>
                    <option>已完成</option>
                    <option>已取消</option>
                </select>
                <input type="date" class="form-control" style="width: 150px; margin-right: 10px;">
                <button class="btn">筛选</button>
            </div>
        </div>

        <div class="table-responsive">
            <table class="table">
                <thead>
                    <tr>
                        <th>申请时间</th>
                        <th>车牌号</th>
                        <th>用途</th>
                        <th>开始时间</th>
                        <th>结束时间</th>
                        <th>状态</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>2024-01-20</td>
                        <td>京A12345</td>
                        <td>公务出差</td>
                        <td>2024-01-21 09:00</td>
                        <td>2024-01-22 18:00</td>
                        <td><span class="status-tag status-using">使用中</span></td>
                        <td>
                            <button class="btn btn-small" onclick="location.href='vehicle-status.html'">填写状况</button>
                        </td>
                    </tr>
                    <tr>
                        <td>2024-01-15</td>
                        <td>京B67890</td>
                        <td>市内公务</td>
                        <td>2024-01-16 09:00</td>
                        <td>2024-01-16 18:00</td>
                        <td><span class="status-tag status-completed">已完成</span></td>
                        <td>
                            <button class="btn btn-small btn-secondary">查看详情</button>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>

        <div class="pagination">
            <button class="btn btn-page">&lt;</button>
            <button class="btn btn-page active">1</button>
            <button class="btn btn-page">2</button>
            <button class="btn btn-page">3</button>
            <button class="btn btn-page">&gt;</button>
        </div>
    </div>
</body>
</html> 